<html>
<head>
	<link rel="stylesheet" href="css/eggplant/jquery-ui-1.8.18.custom.css" type="text/css">
	<link rel="stylesheet" href="css/studentvoice.css" type="text/css">
	<script src="js/jquery-1.7.2.min.js" type="text/javascript" ></script>
	<script src="js/jquery-ui-1.8.18.custom.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="https://www.google.com/jsapi"></script>
	<script type="text/javascript">
		var getData = function () {

			var data = {
				question: getUrlVars()['key']
			};

			jQuery.getJSON('getQuestionAnswers', data, function (answerdata) {
				drawChart(answerdata);
			});
		};

		function getUrlVars()
		{
		    var vars = [], hash;
		    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
		    for(var i = 0; i < hashes.length; i++)
		    {
		        hash = hashes[i].split('=');
		        vars.push(hash[0]);
		        vars[hash[0]] = hash[1];
		    }
		    return vars;
		}

		function drawChart(answerdata) {
			var data = new google.visualization.DataTable();
			data.addColumn('string', 'Answers');
			data.addColumn('number', 'Numbers');
			
			answerCount = {};
			for (var i in answerdata.answers) {
				if (answerCount[answerdata.answers[i].answer] == undefined)
					answerCount[answerdata.answers[i].answer] = 0;

				answerCount[answerdata.answers[i].answer]++;
			}

			answerCountArr = [];
			for (var i in answerCount)
				answerCountArr.push([i, answerCount[i]]);

			data.addRows(answerCountArr);

			// Set chart options
			var options = {'title':answerdata.question,
			               'width':500,//$(window).width(),
			               'height':300,//$(window).height(),
			           		'is3D': true};

			var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
			chart.draw(data, options);
		}

		// Load the Visualization API and the piechart package.
		google.load('visualization', '1.0', {'packages':['corechart']});

		// Set a callback to run when the Google Visualization API is loaded.
		google.setOnLoadCallback(getData);
	</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>